<link rel="stylesheet" href="<?php echo base_url(); ?>assets/css/bootstrap.css">
<link rel="stylesheet" href="<?php echo base_url(); ?>assets/css/bootstrap-responsive.css">
<link rel="stylesheet" href="<?php echo base_url(); ?>assets/css/styles.css">
<script src="<?php echo base_url(); ?>assets/js/jquery.min.js"></script>
<script src="<?php echo base_url(); ?>assets/js/bootstrap.js"></script>
<script src="<?php echo base_url(); ?>assets/js/jsapi.js"></script>
<script type="text/javascript">
  google.load("elements", "1", {
    packages: "transliteration"
  });
  function onLoad() {
    var options = {
      sourceLanguage: google.elements.transliteration.LanguageCode.ENGLISH,
      destinationLanguage: [google.elements.transliteration.LanguageCode.MALAYALAM],
      shortcutKey: 'ctrl+g',
      transliterationEnabled: true
    };
    var control = new google.elements.transliteration.TransliterationControl(options);
    control.makeTransliteratable(['tweet_reply_mal']);
  }
  google.setOnLoadCallback(onLoad);
</script>
<script type="text/javascript">
  function use_text() {
    var rep_text = $('#<?php echo $textbox; ?>', window.parent.document).val();
    var mal_text = $('#tweet_reply_mal').val();
    var new_text = rep_text + mal_text;
    window.parent.set_text_value('<?php echo $textbox; ?>', new_text)
    window.parent.Shadowbox.close();
  }
</script>
<div class="modal-header">
  <h5>മലയാളത്തിൽ ടൈപ്പ് ചെയ്യാം</h5>
</div>
<div class="modal-body">
  <div class="control-group">
    <div class="controls">
      <textarea style="resize:none; width: 100%; height: 55%;" id="tweet_reply_mal" name="tweet_reply_mal" placeholder="Type in malaylam and click use."></textarea>
    </div>
  </div>
</div>
<div class="modal-footer">
  <button onclick="return use_text();" class="btn btn-primary">Use</button>
</div>
